page{
	background: #F5F6FA;
}

.top{
	position: fixed;
	padding-top: 120rpx;
	font-weight: 600;
	font-size: 38rpx;
	color: #333333;
	line-height: 49rpx;
	 left: 30rpx
}
.goods_logo{
	width: 90px;
	height: 90px;
	border-radius: 20rpx;
}

.class_h{
	display: flex;
	flex-direction: column;
	background-size: 100% 100%;
	padding-bottom: 20rpx;

	position: relative;
}

.total{
	display: flex;
	flex-direction: column;
	margin-top: 20rpx;
	margin-left: 32rpx;
	margin-right: 32rpx;
/* 	background-color: #fff; */
	border-radius: 16rpx;
}

.effect_title{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	text-align: center;
	padding-top: 32rpx;
	padding-left: 32rpx;
	padding-right: 32rpx;
}

.effect_t{
	font-weight: bold;
	font-size: 32rpx;
	color: rgba(0,0,0,0.9);
	/* line-height: 48rpx; */
}
.blood_top{
	display: flex;
	
	margin: 220rpx 32rpx 15rpx 32rpx;
}
.blood_sugar{
	width: 480rpx;
	height: 160rpx;
}

.blood_pressure{
	width: 196rpx;
	height: 160rpx;
}


.containers {
	display: flex;
	/* padding-top: 20rpx; */
	/* padding-left: 32rpx;
	padding-right: 32rpx; */
	padding-bottom: 12px;
	width: 220px;
	height: 51px;
	align-items: center;
	text-align: center;
	justify-content: center;
	color: #333333;
}
.bg{
	background-image: url('https://tangmaibao.site/static/upload/1c30ebb390cfb3c1/9f7f39bee270942c.png');
	background-repeat: repeat;
	background-size: 100% 100%;
}
/* .sign_day{
	background-image: url('https://tangmaibao.site/static/upload/c3b6a0c85d4710fe/8615984a64d74d58.png');
	background-repeat: repeat;
	background-size: 100% 100%;
} */
.sign_day{
	font-size: 40rpx;
}
.capsule-bg {
  width: 100%;
  height: 36px;
  background-color: #ecf0f6;
  border-radius: 18px;
  display: flex;
  justify-content: space-between;
  padding: 3px;
  box-sizing: border-box;
}

.capsule {
  flex: 1;
  margin: 0 3px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 15px;
  background-color: transparent;
  color: #333;
}

.capsule.active {
  background-color: #ffffff;
}

.time-range {
  margin-top: 10px;
  text-align: center;
  color: #333;
  background-color: #ecf0f6;
  padding: 15rpx;
  border-radius: 10rpx;
  }
  
  .report_text{
	  display: flex;
	  padding-top: 20rpx;
	  padding-left: 32rpx;
	  padding-right: 32rpx;
	  padding-bottom: 32rpx;
	  color: rgba(102, 102, 102, 1);
	  font-size: 14px;
	  line-height: 22px;


  }
  .sign_days{    
	position: absolute;
    margin-top: 58rpx;
    margin-left: -20rpx;
    color: #333;
    font-weight: bold;
    font-size: 40rpx;
  }
 .progress {
	 display: flex;
	 margin-left: -10rpx;
 }
 
 .gift-text{
	display: flex;
	    background-color: #ECF0F6;
	    margin-left: 22px;
	    margin-right: 22px;
	    padding: 29rpx;
	    line-height: 33px;
	    font-size: 15px;
 }
 
 .sgin{
	 display: flex;
	 flex-direction: column;
	 margin-top: 25rpx;
	 padding-top: 30rpx;
 }
 
 .classify-cell-recom {
     display: flex;
     flex-direction: row;
     justify-content: space-between;
	 padding-left: 15rpx;
	 padding-right: 15rpx;
 	
 	align-items: center;
 	text-align: center;
     width: 100%;
     border-radius: 10rpx;
 	margin-bottom: 20rpx;
	
	/* width: 160px; */
	height: 65px;
	background-color: #E3EDFF;
	border-radius: 10px;
	color: #287EE4;
	position: relative;
 }
 
 .submit_gift{
 	 position: absolute;
	 bottom: -10px;
	 display: flex;
 	 left: 50%;
 	 transform:  translateX(-50%);
	 margin-top: 20rpx;
 }
 
 .submit_icon{
	 position: fixed;
	 left: 50%;
	 transform:  translateX(-50%);
	 bottom: 180rpx;
 }
 
 .progress-wrap {
   width: 100%;
   padding: 20rpx;
   box-sizing: border-box;
 }
 
 /* 灰色底层 */
 .progress-bg {
   width: 100%;
   height: 40rpx;
   background-color: #d9d9d9;
   border-radius: 40rpx;
   overflow: hidden;
   position: relative;
 }
 
 /* 绿色进度条 */
 .progress-bar {
   height: 100%;
   background-color: #1EC157;
   border-radius: 40rpx;
   position: relative;
   overflow: hidden;
   display: flex;
   align-items: center;
   justify-content: flex-end; /* 让文字靠右 */
   padding-right: 16rpx;
   transition: width 0.4s;
 }
 
 /* 白色斜线背景（条纹） */
 .progress-bar::before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 200%;
   height: 100%;
   background-image: repeating-linear-gradient(
     45deg,
     rgba(255, 255, 255, 0.25) 0,
     rgba(255, 255, 255, 0.25) 10rpx,
     transparent 10rpx,
     transparent 20rpx
   );
   animation: stripe-move 2s linear infinite;
 }
 
 /* 条纹动效 */
 @keyframes stripe-move {
   from {
     transform: translateX(0);
   }
   to {
     transform: translateX(-20rpx);
   }
 }
 
 /* 数字样式 */
 .progress-text {
   color: #ffffff;
   font-size: 24rpx;
   font-weight: bold;
   z-index: 2; /* 确保文字在斜线之上 */
 }
 
 .goods_list{
	 display: flex;
	 width: 344px;
	 flex-direction: column;
	 position: relative;
	 padding-bottom: 110rpx;
 }
 
 .close_icon{
	 padding-top: 30rpx;
	 padding-left: 30rpx;
	 padding-bottom: 20rpx;
	 border-bottom: 2rpx solid  #EAEAEA;
 }
 .gift-title{
	 margin-top: 20rpx;
	 margin-left: 90rpx;
	 color: #333333;
	 font-weight: bold;
	 font-size: 16px;
 }
 
 .gift-container {
	 position: relative;
   display: flex;
   flex-direction: row;
   justify-content: space-between;
  /* align-items: center; */
   text-align: center;
   margin-left: 40rpx;
   margin-right: 40rpx;
   margin-top: 30rpx;
 }
 
 /* 每行 */
 .item {
   display: flex;
   align-items: center; /* 垂直居中关键 */
/*   justify-content: center; */
   margin-bottom: 45rpx;
   
 }
 
 /* 圆点 */
 .dot {
   width: 16rpx;
   height: 16rpx;
   border-radius: 50%;
   background-color: #287EE4;
   margin-right: 8rpx;
 
   /* 关键调整 */
   display: inline-block; 
   vertical-align: middle;
 }
 
 /* 文字 */
 .label {
   font-size: 28rpx;
   color: #333;
   line-height: 16rpx; /* 与圆点高度一致 */
   display: inline-block;
   vertical-align: middle;
   margin-top: 35rpx;
 }
 .month{
 		display: flex;
 		width: 97%;
 		// margin-left: 20rpx;
 		// margin-right: 20rpx;
 		// background-color: red;
 	}
	
 	.datess{
 		color: #333333 ;
 	}
 .submit{
 	// display: flex;
 	width: 100%;
 	// position: fixed;
 	bottom: 0px;
 	height: 90px;
 	padding: 12px;
 	box-sizing: border-box;
 	background: #fff;
 	
 }
 .btnsub{
 	display: flex;
 	align-items: center;
 	justify-content: center;
 	font-size: 16px;
 	color: #fff;
 	background: #518FA0;
 	border-radius: 62rpx;
 	height: 44px;
 	margin-left: 40rpx;
 	margin-right: 40rpx;
 }
  .header-top{
 	   display: flex;
 	   border-radius: 12rpx 12rpx 0rpx 0rpx;
 	   background-color: #518FA0;
 	   color: #fff;
 	   padding-top: 28rpx;
      padding-left: 28rpx;	
 	   padding-bottom: 28rpx;	
 	   font-size: 35rpx;
  }
 	.SignOk{
 		font-size: 23rpx;
 		color: #4A7E89;
 	}
.u-tabs__wrapper__scroll-view-wrapper.data-v-0de61367{
		width: 56% !important;
	}
	
	.calendar {
	/* 	height: 100vh; */
		width: 100%;
		 background-color: #fff;
		box-shadow: 0 0 10px 5px #397cca26;

		 border-radius: 10rpx;
		   
	}
	.calendar-head{
		width: 100%;
		display: flex;
		align-items: center;
	}
	.calendar-head-left{
		display: flex;
		align-items: center;
	}
	
	
.head-month{
	color: #000;
	margin: 0 10rpx;
	font-size: 50rpx;
}
.signday{
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	text-align: center;
	/* background-color: #287EE4; */
	width: 35px;
	height: 35px;
	border-radius: 50%;
	color: #287EE4;
	font-size: 16px;
	background-image: url(https://tangmaibao.site/static/upload/273ea0ea8e738df7/82791fb077e4ae68.png);
	background-size: cover;
	background-position: center;
}

.signdays{
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	text-align: center;
	/* background-color: gray; */
	width: 35px;
	height: 35px;
	border-radius: 50%;
	color: #FDC24E;
	font-size: 16px;
	background-image: url(https://tangmaibao.site/static/upload/733bf0361aaec93e/8077d6c15457c037.png);
	background-size: cover;
	background-position: center;
}
			
.calenar-tip{
	margin-left: 50rpx;
	font-size: 26rpx;
	color: #000;
}
		
	.calendar-box{
		display: flex;
		flex-direction: column;
		
		/* border: 1rpx solid #518FA0; */
		
	}
		.header {
			display: flex;
			justify-content: center;
			align-items: center;
			text-align: center;
			padding: 20rpx;
		}
	
	.days-box{
		width: 98%;
		margin-left: 20rpx;
		margin-right: 40rpx;
		// padding: 20rpx 20rpx 20rpx 20rpx;
	}
 
	
 
	.days,
	.dates {
		display: grid;
		
		grid-template-columns: repeat(7, 1fr);
	}
 
	.day,
	.date {
		display: flex;
		flex-direction: column;
		align-items: center;
		// justify-content: center;
		width: 50rpx;
		height: 95rpx;
	}
	.date-item{
		width: 50rpx;
		height: 50rpx;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
	}
 
	.selected {
		// background: linear-gradient(to bottom, #fc9f44, #fb3750);
		color: white;
	}
	.selected1{
		// border: 1px solid #fb3750;
	}
	
	
	.popup-box {
	  width: 550rpx;
	  background: #fff;
	  border-radius: 20rpx;
	  padding: 40rpx 30rpx;
	  display: flex;
	  flex-direction: column;
	  align-items: center;
	}
	.popup-icon {
	  width: 100rpx;
	  height: 100rpx;
	  margin-bottom: 20rpx;
	}
	.popup-title {
	  font-size: 32rpx;
	  font-weight: bold;
	  color: #333;
	  margin-bottom: 10rpx;
	}
	.popup-desc {
	  font-size: 26rpx;
	  color: #666;
	  text-align: center;
	  margin-bottom: 30rpx;
	}
	.btn-group {
	  display: flex;
	  flex-direction: column;
	  gap: 20rpx;
	  width: 100%;
	}
	
	
	.blood01{
		position: absolute;
		top: 20rpx;
		left: 0px;
		width: 146rpx;
		height: 146rpx	;
		
	
	}
	.blood02{
		position: absolute;
		top: 20rpx;
		left: 0px;
		width: 146rpx;
		height: 126rpx	;
		

	}
	
	.blood_text{
		position: absolute;
		top: 24px;
		left: 180rpx;
		color: #333333;
		font-weight: bold;;
	}
	.finish_status{
		width: 70px;
		height: 28px;
		angle: 0 deg;
		opacity: ;
		top: 17px;
		font-size: 32rpx;
		padding-top: 3px;
		x: ;
		left: 224px;
		border-radius: 8px;
		position: absolute;
		background-color: #1EC157;
		color: #fff;
	}
	
	.wait_status{
		width: 70px;
		height: 28px;
		angle: 0 deg;
		opacity: ;
		top: 17px;
		font-size: 32rpx;
		padding-top: 3px;
		x: ;
		left: 224px;
		border-radius: 8px;
		position: absolute;
		background-color: #B9B9B9;
		color: #fff;

	}
  .arrow-right{
	  	position: absolute;
		top: 17px;
		right: 10px;
  }